﻿@page "/docs/components/jumbotron"

<DocsPageTitle>
    Jumbotron component
</DocsPageTitle>

<DocsPageParagraph>
    Lightweight, flexible component for showcasing hero unit style content.
</DocsPageParagraph>

<ul>
    <li>
        <Code Tag>Jumbotron</Code> main container
        <ul>
            <li>
                <Code Tag>JumbotronTitle</Code> main title text
            </li>
            <li>
                <Code Tag>JumbotronSubtitle</Code> text located bellow title to give more context about the jumbotron
            </li>
        </ul>
    </li>
</ul>

<DocsPageSubtitle>
    Examples
</DocsPageSubtitle>

<DocsPageSection>
    <DocsPageSectionHeader Title="Basic">
    </DocsPageSectionHeader>
    <DocsPageSectionContent Outlined FullWidth>
        <BasicJumbotronExample />
    </DocsPageSectionContent>
    <DocsPageSectionSource Code="BasicJumbotronExample" />
</DocsPageSection>

<DocsPageSubtitle>
    Attributes
</DocsPageSubtitle>

<DocsAttributes Title="Jumbotron">
    <DocsAttributesItem Name="Background" Type="Background" Default="None">
        Sets the bar background color.
    </DocsAttributesItem>
</DocsAttributes>